<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html lang="zh-cn">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>购物车</title>
    <link rel="stylesheet" href="http://cdn.bootcss.com/bootstrap/3.3.2/css/bootstrap.min.css">
    <link rel="stylesheet" href="<%=request.getContextPath() %>/resources/css/bootstrap.min.css">
    <link rel="stylesheet" href="<%=request.getContextPath() %>/resources/css/shop.css">
</head>
<body>
    <table class="table table-striped table-responsive">
        <tr>
            <td colspan="3">
                <div class="checkbox">
                    <label><input type="checkbox" name="chk_all" id="chk_all" value="optionall">全选</label>
                </div>
            </td>
            <td><a href="#"><span class="glyphicon glyphicon-trash pull-right"></span></a></td>
        </tr>
        <c:forEach items="${carts.datas}" var="cart">
        <tr>
            <td class="check">
                <div class="checkbox">
                    <label><input type="checkbox" name="chk_list" value="${cart.id}"></label>
                </div>
            </td>
            <td class="cartimg">
                <img src="<%=request.getContextPath() %>/resources/images/goodsImages/${cart.goods.image}" alt=""/>
            </td>
            <td>
                <a href="<%=request.getContextPath() %>/weixin/${cart.goods.id}/single">
                    <strong>${cart.goods.name}</strong>
                </a>
                <p class="price">￥<span>${cart.goods.price}</span></p>
                <p><small>金色/16G/物流配送</small></p>
                <div class="btn-group" role="group">
                    <button class="btn reduce" type="button">-</button>
                    <input class="btn btn-default goodsnum" type="text" disabled="disabled" value="${cart.quantity}">
                    <button class="btn add" type="button">+</button>
                </div>
            </td>
            <td><a href="${cart.id}/cartdelete"><span class="glyphicon glyphicon-remove pull-right"></span></a></td>
        </tr>
        </c:forEach>
    </table>

    <nav id="indexnav" class="navbar navbar-default navbar-fixed-bottom">
        <div class="total pull-left">
            <p>总计：<span class="price">￥<span id="totalprice">0.00</span></span></p>
            <p><small>（共<span id="totalnum">0</span>件，不含运费）</small></p>
        </div>
        <form id="myform" method="post" action="orderCommit">
            <input type="hidden" id="orderjson" name="orderjson" value="">
            <button id="jiesuan" class="btn btn-danger btn-lg pull-right" type="button">去结算</button>
        </form>
    </nav>
<script src="<%=request.getContextPath() %>/resources/js/jquery-1.11.2.min.js"></script>
<script src="<%=request.getContextPath() %>/resources/js/bootstrap.min.js"></script>
<script src="<%=request.getContextPath() %>/resources/js/shop.js"></script>
<script type="text/javascript">
    $("#jiesuan").click(function() {
        var totalprice = $("#totalprice").html();
        var orderjosn = '{"totalprice":' + totalprice + ', "goods":[';
        $("input[name='chk_list']").each(function () {
            if (this.checked) {
                var cartid = this.value;
                var quantity = $(this).closest("tr").find("input[class*=goodsnum]").val();
                orderjosn += '{"cartid":' + cartid + ', "quantity":' + quantity + '},';
            }
        });
        orderjosn = orderjosn.substring(0, orderjosn.length - 1);
        orderjosn += ']}';
        $("#orderjson").val(orderjosn);
        $("#myform").submit();
    });
</script>
</body>
</html>